<template>
  <div>
    子组件
    <button @click="propsInfoClick">propsInfo:{{ propsInfo }}</button>
    <hr />
  </div>
</template>

<script setup>
import { computed } from "vue";

const props = defineProps({
  info: {
    type: Object,
    default() {
      return {};
    },
  },
});
const emit = defineEmits(["update:info"]);
const propsInfo = computed({
  get() {
    console.log(1111);
    return props.info;
  },
  set(value) {
    console.log(value);
    emit("update:info", value);
  },
});
const propsInfoClick = () => {
  propsInfo.value = {
    age: 2,
    msg: {
      count: 100,
    },
  };
};
</script>
<style scoped>
button {
  padding: 20px 20px;
  background-color: pink;
}
</style>
